<template>
    <div class="company">
        <postHead  :showAction="false"></postHead>
        <div class="onestep" v-show="oneStep">
            <div class="company_title">
                <span>个人信息</span>
            </div>
            <div class="company_div">
                <div class="cd_title">
                    <span>*</span>
                    <span>姓名</span>
                </div>
                <div class="cd_input">
                    <input placeholder="请填写企业名称" v-model="form.name" />
                </div>
            </div>
           
      
            <div class="company_div">
                <div class="cd_title">
                    <span>*</span>
                    <span>昵称</span>
                </div>
                <div class="cd_input">
                    <input placeholder="请填写联系人" v-model="form.contactName" />
                </div>
            </div>
  
   
            <div class="company_div">
                <div class="cd_title">
                    <span>*</span>
                    <span>身份证号码</span>
                </div>
                <div class="cd_input">
                    <input placeholder="请填写身份证号码" v-model="form.email" />
                </div>
            </div>

            <div class="company_div">
                <div class="cd_title">
                    <span>*</span>
                    <span>工作地</span>
                </div>
                <div class="cd_input">
                    <input placeholder="请填写工作地" v-model="form.email" />
                </div>
            </div>
          
        </div>
       
        <div class="two_bottom">
            
            <div class="twb_next" @click="sureEdit">
                <span>完成</span>
            </div>
        </div>
    </div>

   


</template>

<script>
import postHead  from '@/components/postHead.vue';

import homeapi from '@/api/api.js';
export default {
    name: 'company',
    data() {
        return {
            name: "",
            creditCode: "",
            licenceImg: "",
            contactName: "",
            phone: "",
            landlineNumber: "",
            email: "",
            oneStep:true,
            enterpriseScale:[],
            showScale:false,
            showIndustry:false,
            enterpriseIndustry:[],

            activeId:[],
            activeIndex:0,
            dialogTitle:"",
            columns:[],



            form:{
                annualRevenue:"",
                annualRevenueName:'',
                contactName:"",
                creditCode:"",
                email:"",
                enterpriseIndustry:"",
                enterpriseIndustryName:"请选择",
                enterpriseNature:"",
                enterpriseNatureName:"",
                enterpriseScale:"",
                enterpriseScaleName:"请选择",
                landlineNumber:"",
                licenceImg:"https://www.baidu.com",
                listingType:"",
                listingTypeName:"",
                name:"",
                officialWebsite:"",
                phone:"",
                staffsNum:"",
                staffsNumName:'',
                wechatOfficialAccount:"",
                columnsData:[],
            },


            selectType:'',
        }
    },
    components: {
        postHead
    },
    mounted(){
        this.getDictList();
        this.getIndustryList();
    },
    methods:{
        //获取字典
        async getDictList(){
            let data=await homeapi.getDictList();
            if(data.code==200){
                this.columnsData=data.result
            }
        },
        

        //获取行业列表
        async getIndustryList(){
            let data=await homeapi.getIndustryList();
            if(data.code==200){
                data.result.map(res=>{
                    res.text=res.name;
                    if(res.child.length>0){
                        res.child.map(json=>{
                            json.text=json.name
                        })
                        res.children=res.child;
                        res.children.map(json=>{
                            if(json.child.length>0){
                                json.child.map(item=>{
                                    item.text=item.name
                                })
                                json.children=json.child

                            }
                            else{
                                json.children=[
                                    {
                                        text:json.text,
                                        id:json.id
                                    }
                                ]
                            }
                        })
                    }
                    else{
                        res.children=[
                            {
                                text:res.text,
                                children:[{
                                    text:res.text,
                                    id:res.id
                                }]
                            }
                        ]
                    }
                })
                
                this.enterpriseIndustry=data.result
                
            }
        },
        showScaleDialog(){
            this.dialogTitle="选择企业规模"
            this.showScale=true;
            this.columns=this.columnsData.enterpriseScale;
            this.selectType="enterpriseScale"
        },
        showEnterpriseNatureDialog(){
            this.dialogTitle="选择企业性质"
            this.showScale=true;
            this.columns=this.columnsData.enterpriseNature
            this.selectType="enterpriseNature"
        },

        showListingTypeDialog(){
            this.dialogTitle="选择上市类型"
            this.showScale=true;
            this.columns=this.columnsData.listingType
            this.selectType="listingType"
        },
        showAnnualRevenueDialog(){
            this.dialogTitle="选择年度营收"
            this.showScale=true;
            this.columns=this.columnsData.annualRevenue
            this.selectType="annualRevenue"
        },
        showStaffsNumDialog(){
            this.dialogTitle="选择员工人数"
            this.showScale=true;
            this.columns=this.columnsData.staffsNum
            this.selectType="staffsNum"
        },




        showIndustryDialog(){
            this.showIndustry=true;
        },
        onConfirmScale(item){
            console.log(item)
            this.form[this.selectType]=item.value
            this.form[this.selectType+'Name']=item.text;

            // this.form.enterpriseScaleName=item.text;
            // this.form.enterpriseScale=item.value
            this.onCancelScale();
        },
        onCancelScale(){
            this.showScale=false;
        },
        onConfirmIndustry(item,indexList){
            let idList=[];
            console.log(this.enterpriseIndustry)
         
            if(indexList.length==3){
                let idFirst=indexList[0]
                idList.push(this.enterpriseIndustry[idFirst].id);
                idList.push(this.enterpriseIndustry[idFirst].children[indexList[1]].id)
                idList.push(this.enterpriseIndustry[idFirst].children[indexList[1]].children[indexList[2]].id)
            }
            else{

            }
            console.log(item)
            this.onCancelIndustry();
            this.form.enterpriseIndustry=idList.join(",")
            this.form.enterpriseIndustryName=item.join("->")
            console.log(this.form.enterpriseIndustry)
            console.log(this.form.enterpriseIndustryName)
        },
        onCancelIndustry(){
            this.showIndustry=false;
        },
        //确认完善信息

        async sureEdit(){
            let form=this.form;
            this.$toast.loading({
                title:"加载中...",
                duration:0,
            })
            let data=await homeapi.editCompany(form);
            if(data.code==200){
                this.$toast("信息完善成功");
                this.$router.push("/")
            }
        }
    }
}
</script>
<style scoped lang="less">
.onestep{
    max-width: 600px;
    margin: 0 auto;
}
.twostep{
    max-width: 600px;
    margin: 0 auto;
}
.company {
    width: 100%;
    padding: 0 .4rem;
    box-sizing: border-box;
    display: inline-block;
    background: #ffffff;
    height: 100vh;
    font-size: 16px;
}

.company_title {
    width: 100%;
    font-size: .48rem;
    color: #333333;
    font-weight: bold;
    line-height: .64rem;
    margin-top: .8rem;
}

.company_div {
    width: 100%;
    display: inline-block;

}

.cd_title {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-top: .5333rem;
    font-size: 16px;
}

.cd_input {
    width: 100%;
    height: 1.0667rem;
    margin-top: .1067rem;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    border-bottom: 1px solid #DEDEDE;
}

.cd_input input {
    width: 100%;
    height: 1.0667rem;
    border: 0px;
    outline: none;
}

.cd_title span:first-child {
    color: #FF1515;
    margin-right: .1333rem;
}

.lbl_div {
    width: 100%;
    height: 1.1733rem;
    background: #F5F5F5;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .3733rem;
    color: #999999;
    margin-top: 1.0667rem;
}

.cd_upload {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-top: .32rem;
}

.upload_div {
    width: 1.6rem;
    height: 1.6rem;
    border-radius: .1067rem;
    border: 1px solid #E6E6E6;
    display: flex;
    align-items: center;
    justify-content: center;
}

.upload_div .iconfont {
    font-size: .4267rem;
    color: #999999;
}
.select_div{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    margin-top: .5333rem;
}
.sd_left{
    flex: 1;
    padding-right:.4rem;
    box-sizing: border-box;
}
.sd_right{
    flex: 1;
    padding-right:.4rem;
    box-sizing: border-box;
}
.sdl_title{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.sdl_title span:first-child{
    font-size: .32rem;
    color: #FF1515;
    line-height:.4267rem;
}
.sdl_title span:last-child{
    font-size:.32rem;
    margin-left: .12rem;
    color: '#333333';
    line-height: .4267rem;
}
.sdl_input{
    width: 100%;
    margin-top: 8px;
    height: 1.0667rem;
    background: #FFFFFF;
    border-radius: 0px 0px 0px 0px;
    border-bottom: 1px solid #DEDEDE;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-right: .4rem;
    box-sizing: border-box;
}
.sdl_input span{
    font-size: .3733rem;
    color: #999999;
}
.sdl_input .iconfont{
    font-size: .32rem;
    color: #999999;
}
.two_bottom{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    
    position: fixed;
    left: 0;
    bottom: 1.8667rem;
}
.twb_div{
    width: 3.2rem;
    height: 1.1733rem;
   display: flex;
   align-items: center;
   justify-content: center;
   font-size: .3733rem;
   color: #333333;
}
.twb_next{
    width: 3.2rem;
    height: 1.1733rem;
    background: #F5F5F5;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: .3733rem;
    color: #999999;
}
.sdl_input input{
    width: 100%;
    height: 100%;
    border: 0px;
    outline: none;
    font-size: .32rem;
}
.code_btn_div{
    width: 100%;
    height: 1.1733rem;
    background: #F5792A;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 2.1333rem;
    font-size: .3733rem;
    color: #ffffff;
}
</style>